//
// Breadcrumbs
// --------------------------------------------------

//== Breadcrumbs variable
// -------------------------
$breadcrumb-padding-vertical: 8px !default;

$breadcrumb-padding-horizontal: 15px !default;

//** Breadcrumb background color
$breadcrumb-bg: #f5f5f5 !default;

//** Breadcrumb text color
$breadcrumb-color: #cccccc !default;

//** Text color of current page in the breadcrumb
$breadcrumb-active-color: $color-gray-light !default;

//** Textual separator for between breadcrumb elements
$breadcrumb-separator: "/" !default;

//== Breadcrumbs styles
// -------------------------
.breadcrumb {
    list-style: none;
    margin-bottom: $line-height-computed;
    padding: $breadcrumb-padding-vertical $breadcrumb-padding-horizontal;
    background-color: $breadcrumb-bg;
    @include fn-border-radius($border-radius-base);

    > li {
        display: inline-block;
  
        + li:before {
            $nbsp: "\00a0";
            content: "#{$breadcrumb-separator}#{$nbsp}"; // Unicode space added since inline-block means non-collapsing white-space
            padding: 0 5px;
            color: $breadcrumb-color;
        }
    }
  
    > .active {
        color: $breadcrumb-active-color;
    }
}